<template>
  <div>Child</div>
</template>

<script>
/*
  props方案适用于父子组件通信
*/
export default {
  name: "Child",
  // props: ["name"],
  // props: {
  //   name: String
  // },
  props: {
    name: {
      type: String,
      required: true,
      // default: "bob",
      // validator(val) {
      //   return val === "jack";
      // },
    },
  },
  mounted() {
    // 标签属性如果通过props声明接受，就会在props上，
    // 同时因为props做了数据代理，所以可以通过this直接访问
    console.log(this.name, this.age);
    // 标签属性如果没有通过props声明接受，就会在$attrs上
    console.log(this.$attrs);
  },
  inheritAttrs: false,
};
</script>

<style scoped></style>
